import Putout from "./Putout";
import PutoutSkeleton from "../skeletons/PutoutSkeleton"
import {useQuery} from "@tanstack/react-query"
import { useEffect } from "react";

const Putouts = ({feedType,username, userId}) => {
    const getPutoutEndpoint = () => {
        switch(feedType) {
        case "forYou":
            return "/api/putouts/all"
        case "following":
            return "api/putouts/following"
        case "putouts":
            return `/api/putouts/user/${username}`
        case "likes":
            return `/api/putouts/likes/${userId}`
        default:
            return "api/putouts/all"
        }
    }

    const PUTOUT_ENDPOINT = getPutoutEndpoint()

    const {
        data: putouts,
        isLoading,
        refetch,
        isRefetching,
    } = useQuery({
        queryKey: ["putouts"],
        queryFn: async () => {
            try {
                const res = await fetch(PUTOUT_ENDPOINT)
                const data = await res.json()

                if (!res.ok) {
                    throw new Error(data.error || "Something went wroing")
                }
                return data
            }catch(error) {
                throw new Error("Error in Putouts.jsx: " + error)
            }
        }
    })

    useEffect(() => {
        refetch()
    }, [feedType, refetch, username])

    // TODO: fix this comp
    return (
        <div>

        </div>
    )
}

export default Putouts